<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script>
    function $(id) {
      return document.getElementById(id);
    }
    function answerClick() {
      $("infoDiv").style.display = "block";
    }
    function buttonClick() {
      let spanObj = document.createElement("span");
      spanObj.innerHTML = $("info").value;
      $("infoDiv").style.display = "none";
      $("textDiv").appendChild(spanObj);
      $("info").value = null;
    }
  </script>
</head>
<body>
  <div style="width: 500px;height: 300px;border: 1px solid #000">
    <div style="height: 100px;width:500px;border: 1px solid #000">
    <p>老师说：</p>
    <p style="text-align: center;font-size: 20px;font-weight: bold">今天考试客户端</p>
    </div>
    <a href="#" onclick="answerClick()">回复</a><br>
    <div id="textDiv"></div>
    <div style="margin-top: 20px;display: none" id="infoDiv">
      <textarea id="info" cols="50" rows="6"></textarea><br>
      <input type="button" value="评论" onclick="buttonClick()">
    </div>
  </div>
</body>
</html>
